{% extends "base_generic.html" %}

{% block content %}
  <div class="container mt-5">
    <div class="row justify-content-center">
      <div class="col-md-6">
        <div class="card">
          <div class="card-header">
            <h2 class="text-center">Login</h2>
          </div>
          <div class="card-body">
            <form method="post" action="{% url 'login' %}">
              {% csrf_token %}
              <div class="form-group mb-3">
                <label for="id_username">Username:</label>
                <input type="text" name="username" class="form-control" id="id_username" required>
              </div>
              <div class="form-group mb-3">
                <label for="id_password">Password:</label>
                <input type="password" name="password" class="form-control" id="id_password" required>
              </div>
              <div class="d-grid gap-2">
                <button type="submit" class="btn btn-primary">Login</button>
              </div>
              <input type="hidden" name="next" value="{{ next }}">
            </form>
            {% if form.errors %}
              <div class="alert alert-danger mt-3">
                Your username and password didn't match. Please try again.
              </div>
            {% endif %}
          </div>
        </div>
      </div>
    </div>
  </div>
{% endblock %} 